<template>
  <div class="address">
    <van-nav-bar :title="type ===1 ? '编辑收货地址' : '新增收货地址'" @click-left="$router.go(-1)" fixed
                 left-arrow/>
    <van-address-edit :area-list="areaList" show-delete show-set-default show-search-result :is-saving="flag"
                      :area-columns-placeholder="['请选择', '请选择', '请选择']"
                      @save="onSave"
                      @delete="onDelete"
                      :show-postal="false"
                      :address-info="AddressInfo"
    />
  </div>
</template>

<script>
import jwt_decode from "jwt-decode";
import areaList from "../../assets/area.js";

export default {
  name: "addressEdit",
  data() {
    return {
      type: "",
      flag: false,
      areaList,
      AddressInfo: {//收货人信息初始值
        name: '',//姓名
        tel: '',//电话
        province: '',//省份
        city: '',//城市
        country: '',//区县
        areaCode: '',//地址code：ID
        addressDetail: '',//详细地址
        isDefault: false,//是否选择默认
      },
    }
  },
  created() {
    this.type = this.$route.query.type;
    if (this.type === 1) {
      this.getAddressById();
    }
  },
  mounted() {
    let height = document.documentElement.clientHeight || document.body.clientHeight;
    let htmlDom = document.getElementsByClassName("address")[0];
    htmlDom.style.height = height + "px";
  },

  methods: {
    //编辑的时候执行的函数
    async getAddressById() {
      let res = await this.$axios.post(this.$api.getAddressById, {
        userId: this.userId,
        addressID: this.$route.query.id
      });
      if (res.status === 200 && res.data.code === 200) {
        this.AddressInfo = res.data.data;
      } else {
        this.$toast.fail(res.data.message);
      }
    },

    //执行数据的修改
    async onSave(content) {
      // 删除不用的参数
      delete content.country;
      delete content.postalCode;

      if (this.type === 0) {
        this.flag = true;
        content.userId = jwt_decode(localStorage.getItem("eleToken")).userId;
        let result = await this.$axios.post(this.$api.addAddress, content);
        setTimeout(() => {
          if (result.status === 200 && result.data.code === 200) {
            this.$toast("添加成功");
            this.flag = false;
            this.$router.push("/address/list");
          } else {
            this.flag = false;
            this.$toast(result.data.message);
          }
        }, 100);
      } else {
        this.flag = true;
        content.addressId = this.$route.query.id;
        let result = await this.$axios.post(this.$api.updateAddress, content);
        setTimeout(() => {
          if (result.status === 200 && result.data.code === 200) {
            this.$toast("修改成功");
            this.flag = false;
            this.$router.push("/address/list");
          } else {
            this.flag = false;
            this.$toast(result.data.message);
          }
        }, 100);
      }
    },

    //删除地址
    async onDelete() {

      //表示的是当前地址存在可以删除 type===1
      if (this.type === 1) {
        // 获取当前的地址id
        let addressId = this.$route.query.id;
        let res = await this.$axios.post(this.$api.deleteAddress, {addressId});
        if (res.status === 200 && res.data.code === 200) {
          this.$toast.success("删除成功");
          this.$router.push("/address/list");
        } else {
          this.$toast.success(res.data.message);
        }
      } else {
        this.AddressInfo = {//收货人信息初始值
          name: '',//姓名
          tel: '',//电话
          province: '',//省份
          city: '',//城市
          country: '',//区县
          areaCode: '',//地址code：ID
          addressDetail: '',//详细地址
          isDefault: false,//是否选择默认
        };
      }
    }
    ,
  }
}
</script>

<style lang="less" scoped>
.address {
  padding-top: 46px;
  background-color: #fafafa;
}

.van-popup {
  .title {
    display: flex;
    height: 44px;
    line-height: 44px;
    justify-content: space-between;
    border-bottom: 1px solid #f2f3f5;

    > span {
      color: #1989fa;
      padding: 0 15px;
      font-size: 14px;
    }
  }

  .picker {
    display: flex;

    .van-picker {
      flex: 1;
    }
  }
}
</style>
